﻿<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<title>上海耀微科技</title>
		<meta name="keywords" content="" />
		<meta name="description" content="" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<link rel="shortcut icon" type="image/png" href="favicon.png">
		<!---<link href="https://fonts.googleapis.com/css?family=Open+Sans:300,300i,400,400i,600,600i,700,700i,800,800i" rel="stylesheet">--->
		<link rel="stylesheet" href="css/bootstrap.css" type="text/css" />
		<link rel="stylesheet" href="css/animate.css" type="text/css" />
		<link rel="stylesheet" href="css/font-awesome.css" type="text/css" />
		<link rel="stylesheet" href="css/style.css" type="text/css" />
		<!--[if IE]>
		<script src="js/html5.js"></script>
		<![endif]-->
	</head>
	<body class="index-page">
		<div id="page-preloader"><span class="spinner"></span></div>
		<header th:replace="www/header :: myheader"  ></header>
		<!-- header -->
		<div class="swiper-container" id="slide">
			<div class="swiper-wrapper">
				<div class="swiper-slide" style="background-image:url(img/slide2.jpg);">
					<div class="caption scroll-animation" data-animation="pulse" data-animation-delay="0s">
						<h1>改变生活 <span>科 技</span></h1>
					</div>
				</div>
				<div class="swiper-slide" style="background-image:url(img/slide-ai-1.jpg);">
					<div class="caption">
						<h1>创造奇迹 <span>科 技</span></h1>
					</div>
				</div>
				<div class="swiper-slide" style="background-image:url(img/slide-iot-1.png);">
					<div class="caption">
						<h1>魅力无限 <span>科 技</span></h1>
					</div>
				</div>
			</div>
			<!-- Add Pagination -->
			<a href="#" class="swiper-top-prev"><i class="fa fa-chevron-left" aria-hidden="true"></i></a>
			<a href="#" class="swiper-top-next"><i class="fa fa-chevron-right" aria-hidden="true"></i></a>
		</div>
		<!-- slide -->
		<section id="services" class="scroll-animation" data-animation="fadeIn" data-animation-delay="0s" style="display:'';">
			<div class="container">
				<div class="row">
					<div class="col-md-4">
						<div class="icon-services">
							<i class="fa fa-television" aria-hidden="true"></i>
						</div>
						<h4>可视化操作</h4>
						<p>通过系统界面，只需点击和选择，以及极少的输入即可完成所有操作。测试结果可视化呈现，以直观的图标形式表现。</p>
					</div>
					<div class="col-md-4">
						<div class="icon-services">
							<i class="fa fa-code" aria-hidden="true"></i>
						</div>
						<h4>远程支持</h4>
						<p>用户可以在设备旁查看运行记录，运行状态，运行历史等信息。同时支持用户在远程，如办公室、家中、上下班途中、出差旅途，这些时候都能查看和操作系统。</p>
					</div>
					<div class="col-md-4">
						<div class="icon-services">
							<i class="fa fa-mobile" aria-hidden="true"></i>
						</div>
						<h4>轻松上手</h4>
						<p>所有操作在一个界面中完成。使用基于浏览器的方式，一个界面即所有，操作、配置、结果均一一呈现，达到一目了然的目的。</p>
					</div>
					<div class="col-md-4">
						<div class="icon-services">
							<i class="fa fa-file-o" aria-hidden="true"></i>
						</div>
						<h4>多样化支持</h4>
						<p>出了支持无线路由器的测试，还支持手机，平板等移动设备的测试。高级版本还将车载设备，医疗设备等物联网设备。</p>
					</div>
					<div class="col-md-4">
						<div class="icon-services">
							<i class="fa fa-life-ring" aria-hidden="true"></i>
						</div>
						<h4>售后服务</h4>
						<p>除了现场支持，我们还提供方便的远程支持服务。依托快速的互联网，我们可以直达用户系统，帮忙诊断和分析问题。即使天各一方，在其最需要帮助之时，也能如近在咫尺，随时伸出援助之手。</p>
					</div>
					<div class="col-md-4">
						<div class="icon-services">
							<i class="fa fa-pencil-square-o" aria-hidden="true"></i>
						</div>
						<h4>轻松定制</h4>
						<p>客户能在系统中轻松定制自己的测试环境和测试条件。除此之外，为满足客户的个性化需求，我们接受更多的定制化需求。尽量满足客户各种苛刻的要求。</p>
					</div>
				</div>
			</div>
		</section>
		<!-- services -->
		<section id="portfolio" class="scroll-animation" data-animation="fadeInUp" data-animation-delay="0s">
			<h2>产品</h2>
			<div class="filter-options portfolio-menu">
				<button class="btn--warning" data-group="ATC">无线路由器全方位自动测试柜</button>
				<button class="btn--warning" data-group="elibsys">EDA电子元器件库管理系统</button>
				<button class="btn--warning" data-group="Plugins" style="display:none;">物联网设备</button>
				<button class="btn--warning" data-group="Wordpress" style="display:none;">数据深度学习</button>
			</div>
			<div id="grid" class="portfolio-wrapper">
				<figure class="col-md-3" data-groups='["ATC"]'>
					<a href="gallery.html"><img src="img/yw-atc-5.png" alt=""></a>
				</figure>
				<figure class="col-md-3" data-groups='["ATC"]'>
					<a href="gallery.html"><img src="img/yw-atc-7.png" alt=""></a>
				</figure>
				<figure class="col-md-3" data-groups='["ATC"]'>
					<a href="gallery.html"><img src="img/yw-atc-8.png" alt=""></a>
				</figure>
				<figure class="col-md-3" data-groups='["ATC"]'>
					<a href="gallery.html"><img src="img/yw-atc-9.png" alt=""></a>
				</figure>
				<figure class="col-md-3" data-groups='["elibsys"]'>
					<a href="gallery.html"><img src="img/yw-elibsys-1.png" alt=""></a>
				</figure>
				<figure class="col-md-3" data-groups='["elibsys"]'>
					<a href="gallery.html"><img src="img/yw-elibsys-2.png" alt=""></a>
				</figure>
				<figure class="col-md-3" data-groups='["elibsys"]'>
					<a href="gallery.html"><img src="img/yw-elibsys-4.png" alt=""></a>
				</figure>
				<figure class="col-md-3" data-groups='["elibsys"]'>
					<a href="gallery.html"><img src="img/yw-elibsys-7.png" alt=""></a>
				</figure>
				<div class="col-1@sm col-1@xs my-sizer-element"></div>
			</div>
		</section>
		<!-- portfolio -->
		<section id="team" style="display:none;">
			<div class="container">
				<h2>团队</h2>
				<div class="row">
					<article class="col-md-4 team-item scroll-animation" data-animation="fadeInLeft" data-animation-delay="0s">
						<div class="img">
							<img src="img/img10.jpg" alt="">
						</div>
						<div class="team-text">
							<h4>Alisa Jobs</h4>
							<p>Quisque vulputate facilisis quam, a fringilla purus varius at. Aliquam ut sodales quam, imperdiet condimentum elit. Fusce ac pharetra augue. </p>
							<div class="spec">Web-Designer</div>
							<ul class="social" style="display:none;">
								<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
								<li><a href="#"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li>
								<li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
								<li><a href="#"><i class="fa fa-youtube-play" aria-hidden="true"></i></a></li>
							</ul>
						</div>
					</article>
					<article class="col-md-4 team-item scroll-animation" data-animation="fadeInUp" data-animation-delay="0s">
						<div class="img">
							<img src="img/img9.jpg" alt="">
						</div>
						<div class="team-text">
							<h4>Nathan Lee</h4>
							<p>Quisque vulputate facilisis quam, a fringilla purus varius at. Aliquam ut sodales quam, imperdiet condimentum elit. Fusce ac pharetra augue. </p>
							<div class="spec">Front-end Developer</div>
							<ul class="social" style="display:none;">
								<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
								<li><a href="#"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li>
								<li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
								<li><a href="#"><i class="fa fa-youtube-play" aria-hidden="true"></i></a></li>
							</ul>
						</div>
					</article>
					<article class="col-md-4 team-item scroll-animation" data-animation="fadeInRight" data-animation-delay="0s">
						<div class="img">
							<img src="img/img11.jpg" alt="">
						</div>
						<div class="team-text">
							<h4>Jack Maroon</h4>
							<p>Quisque vulputate facilisis quam, a fringilla purus varius at. Aliquam ut sodales quam, imperdiet condimentum elit. Fusce ac pharetra augue. </p>
							<div class="spec">Back-end Developer</div>
							<ul class="social" style="display:none;">
								<li><a href="#"><i class="fa fa-facebook" aria-hidden="true"></i></a></li>
								<li><a href="#"><i class="fa fa-google-plus" aria-hidden="true"></i></a></li>
								<li><a href="#"><i class="fa fa-twitter" aria-hidden="true"></i></a></li>
								<li><a href="#"><i class="fa fa-youtube-play" aria-hidden="true"></i></a></li>
							</ul>
						</div>
					</article>
				</div>
			</div>
		</section>
		<!-- team -->		
		<section id="blog">
			<div class="container">
				<h2>最新动态</h2>
				<div class="row">
					<article class="col-md-4 blog-item scroll-animation" data-animation="fadeInLeft" data-animation-delay="0s">
						<div class="img">
							<img src="img/img12.jpg" alt="">
						</div>
						<div class="blog-text">
							<a href="blog_inner.html">
								<h5>疫情持续加剧，中国众志成城</h5>
							</a>
							<p>武汉加油，中国加油，众志成城抗击疫情。</p>
							<a href="http://tags.news.sina.com.cn/%E4%B8%AD%E5%9B%BD%C2%B7%E4%BC%97%E5%BF%97%E6%88%90%E5%9F%8E" target="blank" class="read-more">Read more</a>
						</div>
					</article>
					<article class="col-md-4 blog-item scroll-animation" data-animation="fadeInUp" data-animation-delay="0s">
						<div class="img">
							<img src="img/img13.jpg" alt="">
						</div>
						<div class="blog-text">
							<a href="blog_inner.html">
								<h5>迎接新年，庆新春</h5>
							</a>
							<p>中国传统新年马上到来。公司感谢所有员工在上一年的辛勤付出！努力付出必有好的回报。</p>
							<a class="read-more">No more</a>
						</div>
					</article>
					<article class="col-md-4 blog-item scroll-animation" data-animation="fadeInRight" data-animation-delay="0s">
						<div class="img">
							<img src="img/img14.jpg" alt="">
						</div>
						<div class="blog-text">
							<a href="blog_inner.html">
								<h5>庆祝公司成立1周年</h5>
							</a>
							<p>庆祝公司成立一周年，可喜可贺！愿公司蒸蒸日上，蓬勃发展！</p>
							<a class="read-more">No more</a>
						</div>
					</article>
				</div>
			</div>
		</section>
		<!-- blog -->
		<section class="index-image" style="display:none;">
			<div class="img-left img1"></div>
			<div class="information-right scroll-animation" data-animation="fadeInRight" data-animation-delay="0s">
				<h3>Where does it come from?</h3>
				<p>Quisque vulputate facilisis quam, a fringilla purus varius at. Aliquam ut sodales quam, imperdiet condimentum elit. Fusce ac pharetra augue. Pellentesque a nisl condimentum, luctus ligula commodo, feugiat diam.</p>
				<a href="blog_inner.html" class="read-more">read more</a>
			</div>
		</section>
		<section class="index-image index-image-right" style="display:none;">
			<div class="img-left img2"></div>
			<div class="information-right scroll-animation" data-animation="fadeInLeft" data-animation-delay="0s">
				<h3>Where does it come from?</h3>
				<p>Quisque vulputate facilisis quam, a fringilla purus varius at. Aliquam ut sodales quam, imperdiet condimentum elit. Fusce ac pharetra augue. Pellentesque a nisl condimentum, luctus ligula commodo, feugiat diam.</p>
				<a href="blog_inner.html" class="read-more">read more</a>
			</div>
		</section>
		<div id="partners" class="scroll-animation" data-animation="fadeInUp" data-animation-delay="0s" style="display:none;">
			<div class="container">
				<div class="carousel-wrapper">
					<div class="swiper-container" id="carousel">
						<div class="swiper-wrapper">
							<div class="swiper-slide"><img src="img/partner1.png" alt=""></div>
							<div class="swiper-slide"><img src="img/partner2.png" alt=""></div>
							<div class="swiper-slide"><img src="img/partner3.png" alt=""></div>
							<div class="swiper-slide"><img src="img/partner4.png" alt=""></div>
							<div class="swiper-slide"><img src="img/partner5.png" alt=""></div>
							<div class="swiper-slide"><img src="img/partner1.png" alt=""></div>
							<div class="swiper-slide"><img src="img/partner2.png" alt=""></div>
							<div class="swiper-slide"><img src="img/partner3.png" alt=""></div>
							<div class="swiper-slide"><img src="img/partner4.png" alt=""></div>
							<div class="swiper-slide"><img src="img/partner5.png" alt=""></div>
						</div>
					</div>
				</div>
			</div>
		</div>
		<!-- partners -->
		<section id="contact">
			<div class="container scroll-animation" data-animation="fadeInUp" data-animation-delay="0s" style="display:none;">
				<div class="contact-form">
					<h2>联系我们</h2>
					<div class="row">
						<div class="col-md-6">
							<div class="input-block name-form">
								<input type="text" placeholder="姓名">
							</div>
							<div class="input-block phone-form">
								<input type="text" placeholder="电话">
							</div>
							<div class="input-block email-form">
								<input type="text" placeholder="邮箱">
							</div>
						</div>
						<div class="col-md-6">
							<div class="input-block message-form">
								<textarea placeholder="想说的话"></textarea>
							</div>
						</div>
						<input type="submit" value="发送消息">
					</div>
				</div>
			</div>
		</section>
		<!-- contact -->
		<footer th:replace="www/footer :: myfooter"  ></footer>
		
		<!-- footer -->
		<!-- scripts -->
		<script src="js/lib/jquery.js"></script>
		<script src="js/lib/bootstrap.min.js"></script>
		<script src="js/lib/lightbox.min.js"></script>
		<script src="js/lib/shuffle.js"></script>	
		<script src="js/lib/swiper.min.js"></script>
		<script src="js/lib/waypoints.min.js"></script>		
		<script src="js/script.js"></script>
	</body>
</html>
